import Vue from 'vue';
import App from '../app.vue';
import VueRouter from 'vue-router';
import store from './store';
import header from './component/HeaderBar.vue';
import Scroll from './component/Scroller.vue';
import Rating from './component/Rating.vue';
import PageView from './views/PageView.vue';
import HomeView from './views/HomeView.vue';
import MovieView from './views/MovieView.vue';
import BookView from './views/BookView.vue';
import StatusView from './views/StatusViews.vue';
import GroupView from './views/GroupView.vue';
import DetailView from './views/DetailView.vue';
import SearchView from './views/SearchView.vue';
import RegisterView from './views/RegisterView.vue';
import LoginView from './views/LoginView.vue';
import SubjectView from './views/SubjectView.vue';

// 注册全局组件
Vue.component('headerBar', header);
Vue.component('Scroller', Scroll);
Vue.component('Rating', Rating);

// 安装插件 挂载属性
Vue.use(VueRouter);

// 创建路由对象并配置路由规则
let router = new VueRouter({
	routes: [
		{ path: '/', redirect: {name: 'pages'}},
		{ name: 'pages', path: '/pages/', component: PageView,
			children: [
				 // 斜杠就是绝对路径 相对于父路径
				{ path: '',redirect: '/pages/home'},
				{ name: 'HomeView',path: 'home',component: HomeView},				//首页
				{ name: 'MovieView',path: 'movie',component: MovieView},			//电影
				{ name: 'BookView',path: 'book',component: BookView},				//图书
				{ name: 'StatusView',path: 'status',component: StatusView},			//广播
				{ name: 'GroupView',path: 'group',component: GroupView},			//小组
				{ name: 'DetailView',path: 'detail/:id',component: DetailView},
		]},
		{ path: '/search', name:'SearchView', components: { default: PageView, search: SearchView }},
		{ path: '/register', name: 'RegisterView', component: RegisterView},
		{ path: '/Login', name: 'LoginView', component: LoginView},
		{ path: '/pages/:classify/subject/:id', name: 'SubjectView', components: { default: PageView,subject: SubjectView}},
		{ path: '*', redirect: '/pages/'}
	]
})

new Vue({
    el: '#app',
	router,  // 路由
	store,	// 把 store 对象提供给 “store” 选项，这可以把 store 的实例注入所有的子组件
	template: '<App/>',
    render: c => c(App)
})